<template>
  <el-form-item :prop="prop" :label="label">
    <el-select v-model="model1" clearable style="width: 80px !important; " :disabled="!isEdit" placeholder="">
      <template #label="{ label, value }">
        <span style="font-weight: bold;font-size: large;">{{ label }}</span>
      </template>
      <el-option v-for="item in options1" :key="item" :value="item" :label="item" />
    </el-select>
    <span style="width: 11px;text-align: center;">
      /
    </span>
    <el-select v-model="model2" clearable style="width: 80px !important; " :disabled="!isEdit" placeholder="">
      <template #label="{ label, value }">
        <span style="font-weight: bold;font-size: large;">{{ label }}</span>
      </template>
      <el-option v-for="item in options2" :key="item" :value="item" :label="item" />
    </el-select>
  </el-form-item>
</template>

<script lang="ts" setup>
// ABO/RHD双下拉框, 把字体加大了
defineOptions({
  name: 'MkSelectXueXing'
})

const props = defineProps({
  prop: {
    type: String,
    require: true
  },
  label: {
    type: String,
    default: "ABO / Rh(D)"
  },
  isEdit: {
    type: Boolean,
    default: true
  },
  options1: { // 默认选项1
    type: Array<string>,
    default: ["A", "B", "AB", "O"]
  },
  options2: { // 默认选项2
    type: Array<string>,
    default: ["+", "-"]
  },
})

const model1 = defineModel("model1")
const model2 = defineModel("model2")

</script>
